<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

<script type="text/javascript">
/**
 * Get the current amount for the transfer from account
 */
function getTransferFromAmt(){

var entry = document.getElementById("from").value;
var request = new XMLHttpRequest();

request.onreadystatechange = function()
	{
	  if (request.readyState == 4) // complete, or aborted
	  {
	    if (request.status == 200) { 
	    	updateLabel(); 
	    	} 
	    else if (request.status) {
	      alert("SMError " + request.status + ": " + entry);
	    }
		else { // request.status is undefined
		  alert("SMHttp request aborted: " + entry);
		}
    }
	}
	

var url = "http://localhost:4080/Proj3/BankingServlet";
request.open("POST", url);  // NOTE DEFAULT is async mode.
request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
	
// STEP-4: SEND THE REQUEST TO THE SERVER
// argument to send() is body of POST request
request.send("arg=" + entry);

// continue with entry of numbers
document.getElementById("entryfield").focus();

}

function updateLabel()
{
  var request = new XMLHttpRequest();

  request.onreadystatechange = function()
  	{
    	if (request.readyState == 4) {// complete, or aborted
      		if (request.status == 200) {
        		var result = request.responseText;
        		var textNode = document.getElementById("thelabel").firstChild;
        		textNode.data = "Average: " + result;
    		}
      		else if (request.status) {
		        alert("Error " + request.status + ": " + entry);
      		}
      		else {// request.status is undefined
		        alert("Http request aborted: " + entry);
      		}
		}
  	}
	
  // STEP-3: PREPARE THE REQUEST
  var url = "http://localhost:4080/Proj3/BankingServlet";
  request.open("GET", url); // default mode is asynchronous
  

  // STEP-4: SEND THE REQUEST TO THE SERVER
  request.send();	
}

/**
 * Get the current amount for the transfer to account
 */
function getTransferToAmt()
{
	 xmlhttp=new XMLHttpRequest();

	 
	 
	 xmlhttp.onreadystatechange=function()
  		{
  			if (xmlhttp.readyState==4 && xmlhttp.status==200)
    		{
    			document.getElementById("toAccnt").value=xmlhttp.responseText;
    		}
  		};
	xmlhttp.open("GET","http://localhost:4080/Proj3/BankingServlet",true);
	xmlhttp.send();
}

window.onload = function()
{
		document.getElementById("from").onKeyUp = getTransferFromAmt;
		document.getElementById("Transfer").reset();
		document.getElementById("entryfield").focus();
		
		document.getElementById("to").onKeyUp = getTransferToAmt;
}

</script>
</head>
<title>Awesome Banking System</title>

<body>

<form name="Transfer" ACTION="http://localhost:4080/Proj3/BankingServlet" METHOD="POST">
<h1>Transfer Money</h1>

Transfer from account:
<input type="text" name="from" id="from" onkeyup="getTransferFromAmt()"/><br>
Transfer to account:
<input type="text" name="to" onkeyup="getTransferToAmt()"/><br>
amount:<input type="text" name="amt" /><br>
Amount in the transfer from account:<div id="fromAccnt"></div>
Amount in the transfer to account:<div id="toAccnt"></div>
<input id ="thebutton" type="button" name="trans" value="Transfer">
</form>
<form action=MainPage><input type="submit" value="Back to Main Page"></form>
</body>
</html>